<html>
	<head>
		<title>Axed JSNI Demo</title>

		<style>
			body,td,a,div,.p{font-family:arial,sans-serif}
			div,td{color:#000000}
			a:link,.w,.w a:link{color:#0000cc}
			a:visited{color:#551a8b}
			a:active{color:#ff0000}
		</style>

		<script language='javascript' src='org.axed.user.AxedLib-xs.nocache.js'></script>
		<script language='javascript'>
			var axed1;
			var axed2;

		   	function loadIt() {
				// create a blanked AxEd..
				axed1 = new axed.AxedArea(document.getElementById('axeddiv1'), 800, null);
				
				// add a listener that will block all vocals.
				awli = new axed.KeyPressListener(function (ch) {
					ch = String.fromCharCode(ch);
					var vocals = 'aeiouAEIOU';
					if (vocals.indexOf(ch) >= 0) {
						awli.cancel();
					}
				});
				axed1.addListener(awli.instance, 1);

				// create an AxEdArea with 2 axessories.
				axed2 = new axed.AxedArea(document.getElementById('axeddiv2'), 800, null);
				hpos = new axed.HPositionBar(axed2, document.getElementById("hposbar"));
				vpos = new axed.VPositionBar(axed2, document.getElementById("vposbar"), 3);
				axed2.addListener(hpos.instance, axed.AxedArea.LISTENER_PRIORITY_EXTEND + 1);
				axed2.addListener(vpos.instance, axed.AxedArea.LISTENER_PRIORITY_EXTEND + 2);
			}

			function doGetText(aw) {
				 window.alert(aw.getText1());
			}

			function doClear(aw) {
				aw.clear();
			}

			function doFind(aw) {
				val = document.getElementById("finder").value;
				fr = new axed.FindResult();
				aw.find(val, 0, 0, fr);
				line = fr.getLine();
				if (line < 0) {
					window.alert("not found");
					return;
				}
				aw.moveCursor(line, 0);
				line -= 5;
				if (line < 0) {
					line = 0;
				}
				aw.scrollTopToLine(line);
				aw.setFocus(true);
			}
		</script>
	</head>


	<body onGWTLoad="loadIt();">
		<h1>Axed JSNI Demo</h1>

		<!-- the blanked axed -->
        <h2>A vowel rejecting axedarea box.</h2>
        <p>
		  <input type="button" onClick="doGetText(axed1);" value="Get Text">
		  <input type="button" onClick="doClear(axed1);" value="Clear">
		  <input type="edit" id="finder">
		  <input type="button" onClick="doFind(axed1);" value="Search">
		</p>
   		<div id="axeddiv1" style="border: 1px solid;"></div>

		<!-- the axessoried axed -->
        <h2>A bared axedarea box.</h2>
		<p>
		  <input type="button" onClick="doGetText(axed2);" value="Get Text">
		  <input type="button" onClick="doClear(axed2);" value="Clear">
		</p>
		<table>
		 <tbody>
		  <tr>
		   <td></td>
		   <td><div id="hposbar"></div></td>
		  </tr>
		  <tr>
		   <td><div id="vposbar"></div></td>
		   <td><div id="axeddiv2" style="border: 1px solid;"></div></td>
		  </tr>
		 </tbody>
		</table>
	</body>
</html>
